<script setup>
	import { ref } from "vue";
	import { store } from '@/js/store.js';
	import { debounce, home_api } from '@/js/api.js';

	defineProps({
		hashName: String,
	});

	//输入框定位
	function inputfocus(input) {
		input.scrollIntoView(false);
	}

	const forms = ref({});//提交数据

	//*提交数据
	const onSubmit = debounce(() => {

		home_api.add(forms).then(res => {
			var result = res.data;
			console.log("🚀 ~ onSubmit ~ result:", result)
			if (result.state) {
				console.log('提交成功');
			}else{
				console.log('无法提交！');
			}
		}).catch(err => {
			const res = err.response;
		})
	})


</script>

<template>
	<div class="box">
		<div class="mainbox flexrow justify-around align-center">
			<h1>{{hashName}}</h1>

			<input type="text" v-model="forms.name" @focus="inputfocus($event.target)" placeholder="操作人员" style="width: 200px;margin: 20px auto;">
			<hr class="rowmax">
			<div style="width: 1px"></div>
			<el-button type="success" @click="onSubmit('out')">领取</el-button>
			<el-button type="primary" @click="onSubmit('in')">存入</el-button>
			<div style="width: 1px"></div>
			<div class="rowmax" style="height: 98px"></div>
		</div>

	</div>
</template>

<style scoped>
	.box {
		height: 100%;
	}

	.mainbox {
		height: 100%;
		width: 90%;
		margin: 0 auto;
	}

	h1 {
		width: 100%;
		margin: 1em auto;
		text-align: center;
	}

</style>
<style>

</style>